<%@ page language="java" contentType="text/html; charset=UTF-8"
         pageEncoding="UTF-8" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <title>用户组管理</title>
    <script type="text/javascript" src="/resources/jquery/jquery-3.2.1.min.js"></script>
    <link rel="stylesheet" href="/resources/layui/css/layui.css">
    <script type="text/javascript" src="/resources/layui/layui.js"></script>
    <link rel="stylesheet" href="/resources/layui/css/style.css">
    <script type="text/javascript" src="/resources/js/index.js"></script>

</head>
<script type="text/javascript">
    layui.use('layer', function () {
        var layer = layui.layer;
        var form = layui.form;
        $ = layui.jquery
    });

    //删除用户组并同时删除用户组可查看菜单
    function deleteclick(roleId) {
        layer.confirm('确认删除当前信息么', function (index) {
            location.href = "/delectRole?roleId=" + roleId;
        });

    }
</script>
<body style="background-color: #F5F5F5">

<div style="position: relative; height: 70px;">
    <div style="position: absolute; top: 15px; left: 15px;">
        <a class="layui-btn layui-btn-normal"
           href="/addRoleInfo" target="menuZtree">新增用户组</a>
    </div>
</div>
<!-- 遍历所有用户组 -->
<div class="layui-col-xs12 layui-col-sm6 layui-col-md6"
     style="width: 500px;">
    <div class="layui-collapse" style="width: 500px">
        <div class="layui-colla-item" style="width: 500px">
            <h2 class="layui-colla-title" style="width: 450px">用户组列表</h2>
            <div class="layui-colla-content layui-show" style="width: 460px">
                <table class="layui-table">
                    <colgroup>
                        <col width="100px">
                        <col width="100px">
                    </colgroup>
                    <thead>
                    <tr>
                        <th>角色名称</th>
                        <th>操作</th>
                    </tr>
                    </thead>
                    <tbody>
                    <c:forEach var="item" items="${roleList}">
                        <tr>
                            <td>${item.roleName}</td>
                            <td>

                                <a class="layui-btn layui-btn-xs layui-btn-small" target="menuZtree"
                                   href="/updateRoleMenu?roleName=${item.roleName}&roleId=${item.roleId}">编辑</a>
                                <a class="layui-btn layui-btn-danger layui-btn-xs layui-btn-small"
                                   onclick="deleteclick('${item.roleId}')">删除</a></td>
                        </tr>
                    </c:forEach>
                    </tbody>
                </table>
            </div>
        </div>
    </div>
</div>
<iframe id="iframe" name="menuZtree" frameborder="0"
        style="position: absolute; left: 600px; top: 70px; height: 350px; width: 500px"></iframe>
</body>
</html>